<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<title>旅游</title>
		<link rel="stylesheet" href="{:_SKIN}/weixin/shop/css/reset.css" />
		<link rel="stylesheet" href="{:_SKIN}/weixin/shop/css/lvyou.css" />
		<link rel="stylesheet" href="{:_SKIN}/weixin/shop/css/swiper-3.4.2.min.css" />
		<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_400457_vapvxk8ci8uxr.css"/>
		<link rel="stylesheet" type="text/css" href="{:_SKIN}/weixin/shop/css/font-icon.css"/>
		<script src="{:_SKIN}/weixin/shop/js/swiper-3.4.2.jquery.min.js"></script>
		<script src="{:_SKIN}/weixin/shop/js/swiper-3.4.2.min.js"></script>
	</head>

	<body>
		<div class="content">
			<div class="shop-0">
				<div class="xw_90">
					<a href="{:url('index/index')}">
						<i class="iconfont icon-fanhui zuo bai font_20"></i>
					</a>
					<h2 class="neilian">旅游</h2>
					<a href="{:url('index/index')}">
						<i class="iconfont icon-shouye you bai font_20"></i>
					</a>
				</div>
			</div>
			<!--底部-->
			
			<!--搜索框-->
			<div class="shop-2">
				<input type="text" id="serch"  placeholder="请输入关键词"  class="weui-search-bar__input"/>
			</div>
			
			<!--轮播图-->
			<div class="shop-3">
				<div class="swiper-container">
					<div class="swiper-wrapper">
						<div class="swiper-slide">
							<a href="#"><img src="{:_SKIN}/weixin/shop/pic/lvyou.jpg" /></a>
						</div>
						<div class="swiper-slide">
							<a href="#"><img src="{:_SKIN}/weixin/shop/pic/lvyou2.jpg" /></a>
						</div>

					</div>
				</div>
			</div>
			<script>
				var mySwiper = new Swiper('.swiper-container', {
					autoplay: 5000, //可选选项，自动滑动
					autoplayDisableOnInteraction: false,
				})
			</script>

			<!--九宫格-->
			<div class="shop-4">
				<ul class="xd">

				
					<a href="{:url('tourlist',['catename'=>'农家庄园'])}">
						<li>
							<img src="{:_SKIN}/weixin/shop/img/nongjia.png" />
							<p>农家庄园</p>
						</li>
					</a>



					<a href="{:url('tourlist',['catename'=>'拓展运动'])}">
						<li>
							<img src="{:_SKIN}/weixin/shop/img/tuozhan.png" />
							<p>拓展运动</p>
						</li>
					</a>
					<a href="{:url('tourlist',['catename'=>'特色景点'])}">
						<li>
							<img src="{:_SKIN}/weixin/shop/img/shangwu.png" />
							<p>特色景点</p>
						</li>
					</a>
					<a href="{:url('tourlist',['catename'=>'休闲娱乐'])}">
						<li>
							<img src="{:_SKIN}/weixin/shop/img/yvle.png" />
							<p>休闲娱乐</p>
						</li>
					</a>
					<a href="{:url('tourlist',['catename'=>'民俗风情'])}">
						<li class="mt_10">
							<img src="{:_SKIN}/weixin/shop/img/mingsu.png" />
							<p>民俗风情</p>
						</li>
					</a>
					<a href="{:url('tourlist',['catename'=>'科普基地'])}">
						<li class="mt_10">
							<img src="{:_SKIN}/weixin/shop/img/kepu.png" />
							<p>科普基地</p>
						</li>
					</a>
					<a href="{:url('tourlist',['catename'=>'蔬果采摘'])}">
						<li class="mt_10">
							<img src="{:_SKIN}/weixin/shop/img/yangsheng.png" />
							<p>蔬果采摘</p>
						</li>
					</a>
					<a href="javascript:alert('本月暂无溜6节活动')">
						<li class="mt_10">
							<img src="{:_SKIN}/weixin/shop/img/liuliu.png" />
							<p>溜6节</p>
						</li>
					</a>
				</ul>
			</div>
			<!--每日推荐-->

			<div class="shop-5">
				<h3>|&nbsp;每日推荐</h3>
				<a href="#">更多<i class="iconfont icon-gengduo font_12"></i></a>
			</div>
			<!--推荐内容-->
			<div class="ly-1">
				<div class="swiper-container swiper-container-horizontal">
					<div class="swiper-wrapper">

						{volist name="list1" id="v"}


						<div class="swiper-slide" style="width: 118px; margin-right: 30px;"><img src="{:config('cdn')}{$v.pic}" width="100%" /><p>{$v.name}</p></div>

						{/volist}
						
					</div>
					<!-- Add Pagination -->
				</div>

			</div>
			<script>
				var swiper = new Swiper('.ly-1 .swiper-container', {
					pagination: '.swiper-pagination',
					slidesPerView: 3,
					paginationClickable: true,
					spaceBetween: 20
				});
			</script>
			<!--促销爆品-->
			<div class="shop-5">
				<h3>|&nbsp;促销爆品</h3>
				<a href="#">更多<i class="iconfont icon-gengduo font_12"></i></a>
			</div>
			<!--促销内容-->

			<div class="ly-2">
				<div class="swiper-container swiper-container-horizontal">
					<div class="swiper-wrapper">


					   {volist name="list2" id="v"}
						<div class="swiper-slide swiper-slide-next" style="width: 118px; margin-right: 30px;"><img src="{:config('cdn')}{$v.pic}" width="100%" class="yuanjiao" /><p class="font-14" style="height: 25px; line-height: 25px;overflow: hidden;">{$v.name}</p><p><span class="hong font-16">¥{$v.price}</span><span class="hong font-8">起</span></p></div>

						{/volist}
						
					</div>
					<!-- Add Pagination -->
				</div>
				
			</div>
			<script>
				var swiper = new Swiper('.ly-2 .swiper-container', {
					pagination: '.swiper-pagination',
					slidesPerView: 3,
					paginationClickable: true,
					spaceBetween: 20
				});
			</script>
			<!--热门目的地-->
			<div class="shop-5">
				<h3>|&nbsp;热门目的地</h3>
				<a href="#">更多<i class="iconfont icon-gengduo font_12"></i></a>
			</div>
			<!--热门内容-->
			<div class="shop-7" style="height: auto">
				<ul>
				 {volist name="list2" id="v"}
					<li>
						<div class="zuo t1">
							<img src="{:config('cdn')}{$v.pic}" class="caomei">
						</div>
						<div class="you t2">
							<h3 style="height: 20px;line-height: 20px;">{$v.name}</h3>
							<p class="mt_8">
								<i class="iconfont icon-ruhegoumai goumai"></i>
								<span>20</span>
								<i class="iconfont icon-huaban shoucang mt-zuo_10"></i>
								<span>100</span>
							</p>
							<div class="mt_8" style="margin-top: 4px;">
								<span class="hui">满意度：96%</span>
							</div>
							<p class="mt_8">
								<span class="hong font-16">¥{$v.price}</span>

							</p>
						</div>
					</li>


					{/volist}
					<div style="clear: both;"></div>
				</ul>
			</div>
		</div>
	</body>

</html>